<template>
  <div>
    <xiangqing :title="'费用信息'">
      <template #three>
        <el-row style="margin: 30px 50px 20px 50px; font-size: 16px">
          <el-col :span="8">
            <span>运费：</span>
            <span class="text1">{{ date1.amount }}</span>
            <span class="text">元</span>
          </el-col>
          <el-col :span="8">
            <span>支付方式：</span>
            <span class="text">
              {{ date1.paymentMethod === 1 ? "预结" : "到付" }}
            </span>
          </el-col>
          <el-col :span="8">
            <span>付款状态：</span>
            <span class="text">
              {{ date1.paymentStatus === 1 ? "未付" : "已付" }}
            </span>
          </el-col>
        </el-row>
      </template>
    </xiangqing>
  </div>
</template>

<script>
import Xiangqing from "@/views/business/components/Xiangqing.vue";

export default {
  components: { Xiangqing },
  props: {
    date1: {
      type: Object,
    },
  },
};
</script>

<style lang="scss" scoped>
.text {
  color: #818693;
  font-size: 14px;
}
.text1 {
  font-size: 18px;
  color: #ffb302;
  margin-right: 10px;
}
</style>
